/**
 * Created by qijiahao on 2016/12/13星期二.
 * Updated by Tsuna Cheung on 2016-12-22
 * Updated by qijiahao on 2017-01-26
 */
import React, {Component} from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    ListView,
    Image,
    TouchableOpacity,
    Navigator,
    TextInput
} from 'react-native';
import Comment from '../component/Comment.js';
const Main = {
    name: '小江',
    photo: require('../Images/nothing.png'),
    depatment: '开发部',
    situlation: '职员',
    aim: '完成后端数据解析,完成数据库操作',
    self: '很充实'
};
const List = [
    {
        name: '小江',
        photo: require('../Images/nothing.png'),
        depatment: '开发部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: '很充实'
    },
    {
        name: '小泽',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: '还行吧'
    },
    {
        name: '小民',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '部长',
        aim: '完成后端数据解析,完成数据库操作',
        self: '强无敌'
    },
    {
        name: '徐伊妙',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: 'hahahah'
    },
    {
        name: '小江',
        photo: require('../Images/nothing.png'),
        depatment: '开发部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: '很充实'
    },
    {
        name: '小泽',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: '还行吧'
    },
    {
        name: '小民',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '部长',
        aim: '完成后端数据解析,完成数据库操作',
        self: '强无敌'
    },
    {
        name: '徐伊妙',
        photo: require('../Images/nothing.png'),
        depatment: '财务部',
        situlation: '职员',
        aim: '完成后端数据解析,完成数据库操作',
        self: 'hahahah'
    },
];
export default class discover extends Component {
    //初始化模拟数据

    constructor(props) {
        super(props);
        const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
        this.state = {
            dataSource: ds.cloneWithRows(List),
            display: false,
            dir: 'row'
        };
    }

    render() {
        return (
            <View>
                <View style={styles.head}>
                    <Text style={styles.headFont}>
                        发现
                    </Text>
                </View>

                <ListView
                dataSource={this.state.dataSource}
                renderRow={rowdata=>this._renderRow(rowdata)}
                renderHeader={this._renderHeader}/>
            </View>
        );
    }

    _renderHeader = () => {
        return (
            <View>
                <View style={styles.around}>
                    <View style={styles.top}>
                        <Image style={[styles.img, styles.left]}
                               source={require('../Images/nothing.png')}/>

                        <View style={styles.right}>
                            <Text>
                                {Main.name} {Main.depatment} {Main.situlation}
                            </Text>

                            <Text style={styles.subTop}>
                                今日目标:{Main.aim}
                            </Text>
                        </View>
                    </View>

                    <View style={styles.top}>
                        <Text style={{flex: 5}}>
                            自我评价:{Main.self}
                        </Text>

                        <View style={{flex: 1}}>
                            <TouchableOpacity onPress={this.props.function}>
                                <Text>
                                    评价
                                </Text>
                            </TouchableOpacity>
                        </View>
                    </View>
                </View>
            </View>
        )
    };
    _renderRow = (rowData) => {
        return (
            <View style={styles.around}>
                <View style={styles.top}>
                    <Image style={[styles.img, styles.left]}
                           source={rowData.photo}/>

                    <View style={styles.right}>
                        <Text>
                            {rowData.name} {rowData.depatment} {rowData.situlation}
                        </Text>

                        <Text style={styles.subTop}>
                            今日目标:{rowData.aim}
                        </Text>
                    </View>
                </View>

                <View style={styles.top}>
                    <Text style={{flex: 5}}>
                        自我评价:{rowData.self}
                    </Text>
                </View>

                {<Comment/>}

                <View style={styles.X}>
                </View>

            </View>

        )
    }
}

const styles = StyleSheet.create({
    head: {
        height: 56,
        backgroundColor: "#2E7CDE",
        justifyContent: "center",
        alignItems: 'center',
    },
    headFont: {
        color: "white",
        fontSize: 30
    },
    around: {
        flex: 1,
        borderWidth: 0.5,
    },
    img: {
        width: 60,
        height: 60,
    },
    top: {
        flexDirection: 'row',
        flex: 1,
        marginLeft: 20,
        marginTop: 10,
    },
    left: {
        flex: 1,
    },
    right: {
        flex: 5,
        marginLeft: 20,
    },
    subTop: {
        marginTop: 8,
    },

    X: {
        height: 5,
    },
    _size: {
        height: 100,
        width: 340,
        borderWidth: 0.5,
    }
});